<template>
		<u-form style="padding-bottom: 100rpx;box-sizing: border-box;" class="form" :model="formData" ref="form" :label-width="130">
			<u-form-item label="下班方式">
				<template v-slot:right>
					<span v-if="businessWorkOffWay==2">手动下班</span>
					<block v-else>
						<u-button :class="['u-m-r-10',formData.workOffWay==1?'select-btn':'']" size="mini" @click="formData.workOffWay=1">手动下班</u-button>
						<u-button :class="formData.workOffWay==2?'select-btn':''" size="mini" @click="formData.workOffWay=2">自动下班</u-button>
					</block>

				</template>
			</u-form-item>
			<u-form-item label="接单方式">
				<template v-slot:right>
					<span v-if="businessTakeOrdersWay==1">手动接单</span>
					<template v-else>
						<u-button :class="['u-m-r-10',takeOrdersWay==1?'select-btn':'']" size="mini"  @click="formData.takeOrdersWay=1">手动接单</u-button>
						<u-button  :class="formData.takeOrdersWay==2?'select-btn':''"  size="mini"  @click="formData.takeOrdersWay=2">自动接单</u-button>
					</template>
				</template>
			</u-form-item>
		</u-form>
		<view class="u-text-center">
			<u-button class="submit" size="medium" @click="submit">提 交</u-button>
		</view>

</template>
<script setup>
	import {onLoad} from "@dcloudio/uni-app"
	import {reactive,ref} from "vue"
	import waitersApi from "@/api/waiters"
	import {bindingBean} from "@/utils"
	const formData = reactive({
		workOffWay: 1, //下班方式 1手动下班 2自动下班,
		takeOrdersWay: 1 ,// 接单方式 1手动接单  2自动接单
	})
	let businessWorkOffWay = 1 // 1表示可以允许自动手动下班 2表示只允许手动下班
	let businessTakeOrdersWay = 1 // 1表示只允手动接单 2表示可以选择自动手动接单
	async function getData(){
		const {data} = await waitersApi.getPartInfo()
		bindingBean(formData,data)
		businessTakeOrdersWay = data.businessTakeOrdersWay
		businessWorkOffWay = data.businessWorkOffWay
	}
	async function submit(){
		const {confirm} = await uni.showModal({
			title:"提示",
			content:"确定提交？"
		})
		if(!confirm) return
		await waitersApi.setPartInfo(formData)
		uni.showToast({
			type:"success",
			title:"设置成功"
		})
	}

	onLoad(() => {
		getData()
	})
</script>

<style lang="scss" scoped>
	.form{
		:deep(.u-form){
			padding: 20rpx;
		}
	}
	.select-btn{
		:deep(button){
			background-color: $theme-bg-color;
			color: white;
		}
	}
	.submit{
		// width: 80%;
		// left: 0;
		// right: 0;
		// margin: auto;
		// position: fixed;
		// bottom: 100rpx;
		:deep(button){
			padding: 0 200rpx;
			color: white;
			&::after{
				display: none;
			}
			background-color: $theme-bg-color;
		}
	}
</style>
